<template>
	<view>
		<box-a>
			<view class="lf-select">
				<image v-if="icon != null" :src="icon" class="icon"></image>
				<uni-data-select
					:value="v"
					:localdata="range"
					:clear="false"
					:disabled="disabled"
					@change="change"
				  ></uni-data-select>
			</view>
		</box-a>
	</view>
</template>

<script>
	
	import boxA from '@/components/box-a/box-a.vue'
	
	export default {
		components: {
			boxA
		},
		name:"lf-select",
		props: {
			disabled: {
				type: Boolean,
				default: false
			},
			v: {
				type: Number,
				default: 0
			},
			range: {
				type: Array,
				default: []
			},
			icon: {
				type: String,
				default: null
			}
		},
		data() {
			return {
			};
		},
		methods: {
			
			change(e) {
				this.$emit('change', e)
			}
		}
	}
</script>

<style scoped>
	
	.lf-select {
		color: rgba(113, 113, 113, 1.0);
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
	}
	
	.icon {
		width: 25px;
		height: 25px;
		margin-left: 3px;
		border-radius: 2px;
	}
	
</style>